import 'package:flutter/material.dart';
import 'package:flutter_ui/widgets/menu_grid_item.dart';

/// 工作台
class WorkSpace extends StatefulWidget {
  const WorkSpace({super.key});

  @override
  State<WorkSpace> createState() => _WorkSpaceState();
}

class _WorkSpaceState extends State<WorkSpace> {

  @override
  Widget build(BuildContext context) {
    // 获取屏幕尺寸
    final Size screenSize = MediaQuery.of(context).size;
    // 根据屏幕宽度动态计算网格列数和宽高比
    final int crossAxisCount = screenSize.width < 600 ? 4 : screenSize.width < 900 ? 6 : 8;
    
    // 根据屏幕尺寸动态计算宽高比，确保在不同设备上都有合适的显示效果
    // 在较宽的屏幕上使用更大的宽高比，使项目更扁平化
    // 降低宽高比，为文本提供更多垂直空间
    // 注意：宽高比越小，垂直空间越大；宽高比越大，水平空间越大
    final double childAspectRatio = screenSize.width < 600 ? 0.75 : // 进一步降低小屏幕的宽高比
                                  screenSize.width < 900 ? 0.95 : 1.15;
    
    return Scaffold(
      appBar: AppBar(
        title: const Text('心血管内科二病区 | 妙护士'),
        centerTitle: true,
      ),
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.all(16.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              // 医疗循环模块
              _buildSectionCard(
                '医疗循环',
                [
                  MenuGridItem(icon: Icons.medical_services, title: '口服液执行'),
                  MenuGridItem(icon: Icons.science, title: '检验执行'),
                  MenuGridItem(icon: Icons.healing, title: '治疗执行'),
                  MenuGridItem(icon: Icons.monitor_heart, title: '皮试执行'),
                  MenuGridItem(icon: Icons.volunteer_activism, title: '护理执行'),
                  MenuGridItem(icon: Icons.biotech, title: '输液配置'),
                  MenuGridItem(icon: Icons.clean_hands, title: '输液执行'),
                  MenuGridItem(icon: Icons.thermostat, title: '输血执行'),
                ],
                crossAxisCount: crossAxisCount,
                childAspectRatio: childAspectRatio,
              ),
              const SizedBox(height: 16),
              
              // 病区批量事务模块
              _buildSectionCard(
                '病区批量事务',
                [
                  MenuGridItem(icon: Icons.monitor_weight, title: '体征批量监测'),
                  MenuGridItem(icon: Icons.location_on, title: '病区巡视'),
                  MenuGridItem(icon: Icons.medication, title: '病区发药'),
                  MenuGridItem(icon: Icons.science_outlined, title: '病区送检'),
                  MenuGridItem(icon: Icons.water_drop, title: '取血'),
                  MenuGridItem(icon: Icons.bloodtype, title: '血袋回收'),
                  MenuGridItem(icon: Icons.sanitizer, title: '半管凝样'),
                ],
                crossAxisCount: crossAxisCount,
                childAspectRatio: childAspectRatio,
              ),
              const SizedBox(height: 16),
              
              // 工作辅助模块
              _buildSectionCard(
                '工作辅助',
                [
                  MenuGridItem(icon: Icons.note_alt, title: '备忘录'),
                  MenuGridItem(icon: Icons.calendar_month, title: '科室排班'),
                  MenuGridItem(icon: Icons.pie_chart, title: '工作量统计'),
                  MenuGridItem(icon: Icons.schedule, title: '病区执行明细'),
                  MenuGridItem(icon: Icons.announcement, title: '病区公告'),
                ],
                crossAxisCount: crossAxisCount,
                childAspectRatio: childAspectRatio,
              ),
            ],
          ),
        ),
      ),
    );
  }

  /// 构建模块卡片
  /// @param title 模块标题
  /// @param items 菜单项列表
  /// @param crossAxisCount 每行显示的项目数
  /// @param childAspectRatio 子项宽高比
  Widget _buildSectionCard(String title, List<MenuGridItem> items, {required int crossAxisCount, required double childAspectRatio}) {
    return Card(
      elevation: 2,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              title,
              style: const TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),
            GridView.count(
              crossAxisCount: crossAxisCount, // 每行显示的项目数
              shrinkWrap: true, // 使GridView包裹其内容
              physics: const NeverScrollableScrollPhysics(), // 禁用GridView的滚动
              // 调整垂直间距，增加可以解决文字显示不全的问题
              mainAxisSpacing: 16, // 增加垂直间距，提供更好的视觉分隔
              // 调整水平间距，增加可以减少文字换行的可能性
              crossAxisSpacing: 16, // 增加水平间距，提供更好的视觉分隔
              // 调整宽高比，降低数值会增加垂直空间，解决文字显示不全的问题
              childAspectRatio: childAspectRatio,
              // 移除GridView的内边距，由MenuGridItem自己控制
              // 如果出现边缘文字显示不全，可以添加适当的内边距
              padding: EdgeInsets.zero,
              children: items,
            ),
          ],
        ),
      ),
    );
  }
}